Send media events with an API client

Collect user interactions as events on your media website.

Capturing real-time user interactions as events gives you actionable insights with click and conversion metrics, and they help you increase your customer engagement and conversions. Events are used to activate Algolia features and products like:

• NeuralSearch
• Algolia Recommend
• Personalization
• Dynamic Re-Ranking
• Query Categorization
• Search analytics
• Revenue analytics
• A/B testing.

Enable events collection

Set the clickAnalytics parameter to true when making search requests. This includes the queryID parameter in the search response, which is required for linking events and search requests.

JavaScript

    const algoliasearch = require("algoliasearch");
    const client = algoliasearch("YourApplicationID", "YourSearchOnlyAPIKey");
    const index = client.initIndex("YourIndexName");

    index
    .search("query test", 
+     { clickAnalytics: true }
    ).then(({ queryID, hits }) => {
        console.log(hits);
        console.log(queryID);
    });

Initialize search-insights.js

Install the search-insights library.

HTML

<script>
    var ALGOLIA_INSIGHTS_SRC =
    "https://cdn.jsdelivr.net/npm/search-insights@2.16.3/dist/search-insights.min.js";
    !function(e,a,t,n,s,i,c)
    {
    ((e.AlgoliaAnalyticsObject = s),
    (e[s] =
        e[s] ||
        function () {
        (e[s].queue = e[s].queue || []).push(arguments);
        }),
    (e[s].version = (n.match(/@([^\/]+)\/?/) || [])[1]),
    (i = a.createElement(t)),
    (c = a.getElementsByTagName(t)[0]),
    (i.async = 1),
    (i.src = n),
    c.parentNode.insertBefore(i, c))
    }
    (window,document,"script",ALGOLIA_INSIGHTS_SRC,"aa");
</script>

After installing the search-insights library, initialize the client in your website.

JavaScript

import aa from 'search-insights';

aa("init", {
appId: "YourApplicationID",
apiKey: "YourSearchOnlyAPIKey",
});

Understand which events to track

To understand which events you should send, think about the different steps a user takes through your website to reach the final goal: the product purchase.

Search results page

Starting with a search on any of your pages, a user might take the following actions:

1. Select a product from the search results to open the content details page.
2. Consume content, such as watching a video, reading an article, or listening to an audio track.
3. Interact with content, such as liking, subscribing, or following.

Search and search results pages

User action	Method name
User clicks search result	clickedObjectIDsAfterSearch
User adds product to shopping cart	addedToCartObjectIDsAfterSearch
User clicks categories/filters	clickedFilters
User views search results	viewedObjectIDs

Browse/category page

User action	Method name
User clicks content	clickedObjectIDsAfterSearch
User views content	viewedObjectIDs

Content details page

User action	Method name
User views content	viewedObjectIDs

Keep track of query IDs

Conversion events are often triggered outside of the search results page. In order to correctly attribute which query is responsible for a conversion, it is necessary to keep track of the query ID returned when a search is performed so that it can be included in conversion events.

To relate the conversion events back to the search request made on your search results or category pages, you need to keep track of the query IDs across your pages.

Track click events

Click events capture when users indicate they want to view specific pieces of content. Add the following code to track a user navigating to a piece of content from a search results page:

JavaScript

window.aa("clickedObjectIDsAfterSearch", {
    index: "YourIndexName",
    eventName: "Item Clicked",

    // Fields from the search response.
    queryID: "YourQueryID",
    objectIDs: ["objectID-1"],
    positions: [1],
});

In clickedObjectIdsAfterSearch:

• queryID is used by Algolia to relate the event to a prior search or browse event.
• objectIDs should contain the ID of the article. This can be retrieved from the objectID field of the hits array returned from the search request.
• positions indicates the position of the item in the search results. For example, if the user clicked on the top result on the page, positions should be [1].

If a user found a piece of content without performing a search---for example, they browsed there from elsewhere on your site, add the following code to track that:

JavaScript

window.aa("clickedObjectIDs", {
    index: "YourIndexName",
    eventName: "Item Clicked",
    objectIDs: ["objectID-1"],
})

Track conversion events

An example of a conversion event that may be relevant to your media site:

JavaScript

// A user reached the bottom of an article page
window.aa("convertedObjectIDsAfterSearch", {
eventName: "Article Read",
index: "YourIndexName",
queryID: "query-1",
objectIDs: ["objectID-1"],
});

The window.aa object is the API client for the Insights API and is globally available if you enabled automatic events collection.

In convertedObjectIDsAfterSearch:

• queryID is used by Algolia to relate the event to a prior search.
• objectIDs indicates which items were part of the conversion.The objectID parameter is included in the search response for each hit.

If the event isn’t directly related to a search, for example, it’s triggered on the homepage, use the convertedObjectIDs method instead.

JavaScript

// A user watched a video
window.aa("convertedObjectIDs", {
eventName: "Video Watched",
index: "YourIndexName",
objectIDs: ["objectID-1"],
});

Some other examples of conversion events are:

• Article Bookmarked: a user bookmarked an article.
• Article Liked: a user liked an article.
• Article Recommended: a user recommended an article.
• Playlist Followed: a user followed a playlist.
• Author Followed: a user followed an author.
• Brand Followed: a user followed a brand.

For Algolia Recommend and Personalization, capture additional click events when users select individual items:

• On your home page
• From recommendations

To send click events with the Insights client, add the following code whenever a user clicks on an article---for example, on your home page.

JavaScript

window.aa("clickedObjectIDs", {
index: "YourIndexName",
eventName: "Article Clicked",
objectIDs: ["objectID-1"],
});

(Optional) Handle known users for Personalization

For effective personalization, you need to identify users across sessions. It’s best to use an identifier from your authentication system after users signed in.

After getting the identifier from your system, set it as authenticatedUserToken parameter.

JavaScript

// Get a unique, pseudonymous identifier for signed-in users
const authenticatedUserToken = getUserTokenAfterSignIn();
window.aa("setAuthenticatedUserToken", authenticatedUserToken);

When you set the authenticatedUserToken parameter in the Insights client, you also need to update the user token you send with your search requests.

JavaScript

function getEffectiveUserToken() {
    const userToken = window.aa("getUserToken");
    const authenticatedUserToken = window.aa("getAuthenticatedUserToken");
    return authenticatedUserToken || userToken;
}

index.search("query", {
    clickAnalytics: true,
    userToken: getEffectiveUserToken(),
}).then(({queryID, hits}) => {
    console.log(hits);
    console.log(queryID);
})

If you can’t get persistent user identifiers from your system, you can store the anonymous user token in a cookie after obtaining user consent.

JavaScript

// If user consented
aa("init", {
    partial: true,
    useCookies: true,
});

For more information, see User token.

(Optional) Send view events for Personalization

Personalization benefits from the same click and conversion events, plus it can use view events to enrich user profiles.

To capture view events, such as when a user views search results, add this code:

JavaScript

window.aa("viewedObjectIDs", {
    index: "YourIndexName",
    eventName: "Article Viewed",
    objectIDs: ["objectID-1"],
});